<template>
    <div class="not-found-container">
        <img src="http://39.103.167.233/static/images/not_found.png" alt="" />
        <p>非常抱歉，页面走丢了 ···</p>
        <router-link :to="{ name: 'Home' }"> 返回首页 </router-link>
    </div>
</template>

<style lang="less">
@import url(~@/styles/var.less);
.not-found-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #f1f2f6;
    img {
        margin: 50px auto 0;
        display: block;
    }
    a {
        display: inline-block;
        margin-top: 15px;
        font-size: 20px;
        color: @primary;
        padding: 5px 15px;
        border-radius: 12px;
        border: 1px solid @primary;
        &:hover {
            color: #fff;
            background-color: @primary;
        }
    }
}
</style>
